﻿{% extends "app/layout.html" %}

{% block content %}

{% load staticfiles %}

<div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="2000">

    <ol class="carousel-indicators">

        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>

        <li data-target="#myCarousel" data-slide-to="1"></li>

        <li data-target="#myCarousel" data-slide-to="2"></li>

        <li data-target="#myCarousel" data-slide-to="3"></li>

    </ol>

    <div class="carousel-inner" role="listbox">

        <div class="item active">

            <img src="{% static 'app/content/DeathMagnetic1.jpg'%} " alt="Первый слайд" class="img-responsive" />
            
            <div class="carousel-caption" role="option">

                <p class="p_black">

                    Недооцененный альбом
                 
                </p>
                <a class="btn btn-default" href="{% url 'blogpost' parametr=1 %}">

                        Читать далее

                </a>

            </div>
            

        </div>

        <div class="item">

            <img src="{% static 'app/content/Metallica3.5.jpg'%}" alt="Второй слайд"  class="img-responsive" />

            <div class="carousel-caption" role="option">

               <p class="p_black">

                    Изменчивость...
                 
                </p>
                <a class="btn btn-default" href="{% url 'blogpost' parametr=2 %}">

                        Читать далее

                </a>

            </div>

        </div>

        <div class="item">

            <img src=" {% static 'app/content/slayer.jpg'%} " alt="Третий слайд"  class="img-responsive" />

            <div class="carousel-caption" role="option">

               <p class="p_black">

                    3я статья
                 
                </p>
                <a class="btn btn-default" href="{% url 'blogpost' parametr=3 %}">

                        Читать далее

                </a>

            </div>

        </div>

        <div class="item">
    
            <img src=" {% static 'app/content/Unforgiven.jpg'%} " alt="Третий слайд"  class="img-responsive" />
            
            <div class="carousel-caption" role="option">

                <p class="p_black">

                    Непрощенные 
                 
                </p>
                <a class="btn btn-default" href="{% url 'blogpost' parametr=4 %}">

                        Читать далее

                </a>
          
            </div>
            

        </div>

    </div>

    <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">

        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>

        <span class="sr-only">Previous</span>

    </a>

    <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">

        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>

        <span class="sr-only">Next</span>

    </a>

</div>

</br>
<h2 >{{ title }}</h2> <br /> 

{% for post in posts %}
<hr/>
<div class="center">
<h3> Автор - {{post.author}} </h3>
<h2 class=""> {{post.title}} </h2>
<h4> {{post.posted}} </h4>
<p> {{post.description}} </p>
<p><a href="{% url 'blogpost' parametr=post.id %}"> Читать далее </a> </p>
</div>
{% endfor %}

{% endblock %}